<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="imagetoolbar" content="no" />
	<title>FancyBox 1.2.5 | Demo page</title>
	<link rel="stylesheet" href="style.css" />
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
	<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.2.5.css" media="screen" />
	<script type="text/javascript" src="./fancybox/jquery.fancybox-1.2.5.pack.js"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			$("a.zoom").fancybox();

			$("a.zoom1").fancybox({
				'overlayOpacity'	:	0.7,
				'overlayColor'		:	'#FFF'
			});

			$("a.zoom2").fancybox({
				'zoomSpeedIn'		:	500,
				'zoomSpeedOut'		:	500,
				'overlayShow'		:	false
			});
		});
	</script>
</head>
<body>
<div id="content">
	<h1>FancyBox <em>v1.2.5</em></h1>

	<p>This is a demo page. <a href="http://fancybox.net">Home page</a></p>

	<hr />

	<p>
		Single image <br />

		<a class="zoom1" title="Sample title" href="1_b.jpg"><img src="1_s.jpg" alt="" /></a>
		<a class="zoom2" href="2_b.jpg"><img src="2_s.jpg" alt="Another title" /></a>
	</p>

	<p>
		Image group <br />

		<a class="zoom" rel="group" title="Group title #1" href="3_b.jpg"><img src="3_s.jpg" alt="" /></a>
		<a class="zoom" rel="group" title="Group title #2" href="4_b.jpg"><img src="4_s.jpg" alt="" /></a>
		<a class="zoom" rel="group" href="5_b.jpg"><img src="5_s.jpg" alt="" /></a>
	</p>
</div>
</body>
</html>
